import {  NavLink } from "react-router-dom"
import RouterConfig from './router/Router'

import "./css/App.css"

function App() {
  return (
    <div id="app" className="container">
      <nav className="navbar navbar-inverse navbar-fixed-top">
        <div className="container">
          <div className="navbar-header">
            <button type="button" className="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
              <span className="sr-only">Toggle navigation</span>
              <span className="icon-bar"></span>
              <span className="icon-bar"></span>
              <span className="icon-bar"></span>
            </button>
            <a className="navbar-brand" href="#">学生管理系统</a>
          </div>
          <div id="navbar" className="collapse navbar-collapse">
            <ul className="nav navbar-nav">
              <li><NavLink to="/home">主页</NavLink></li>
              <li><NavLink to="/about">关于我们</NavLink></li>
              <li><NavLink to="/detail">详情页</NavLink></li>
            </ul>
            <ul className="nav navbar-nav navbar-right">
              <li className="navbar-right"><NavLink to="/add">添加用户</NavLink></li>
            </ul>
          </div>
        </div>
      </nav>
      <div className="content">
        <RouterConfig />
      </div>
    </div>
  );
}

export default App;
